<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=3, minimum-scale=1, user-scalable=no">
    <title>我的订单</title>
    <meta name="format-detection" content="telephone=no">
    <script src="__GLOBAL__/jquery-1.8.3.min.js"></script>
    <script src="__GLOBAL__/common.js"></script>
    <link rel="stylesheet" href="__GLOBAL__/reset.css"/>
    <link rel="stylesheet" href="__CSS__/common.css">
    <link rel="stylesheet" href="__CSS__/order.css">
</head>
<body>
    <div class="header">
        <i class="back-icon"></i>
        <div class="header-center flex">
            <span class="flex1 active">未兑换</span>
            <span class="flex1">已兑换</span>
        </div>
    </div>
    <div class="content">
        <div class="tab-content">
            <div class="order-goods-box">
            <div class="order-active-title flex">
                <div class="flex1">这可能是hi个什么直播</div>
                <div class="time">
                    2017.02.02&nbsp;08:00
                </div>
            </div>
            <div class="goods-line flex">
                <div class="goods-img">
                    <img src="__IMG__/order/order-goods.jpg"/>
                </div>
                <div class="flex1">
                    <p class="order-goods-title">AQUE&nbsp;ALLEGORIA</p>
                    <p class="order-goods-txt">
                        花草水语淡香水（雪梨冰沙）佛手柑香调融合雪梨香调75ml
                    </p>
                    <div class="order-goods-bottom flex">
                        <div class="order-goods-left flex1">
                            <div class="data">
                                <p class="price">￥600.00</p>
                                <p class="num">x1</p>
                            </div>

                        </div>
                        <div class="dh-btn">
                            兑换
                        </div>
                    </div>
                </div>
            </div>
            <div class="goods-line flex">
                <div class="goods-img">
                    <img src="__IMG__/order/order-goods.jpg"/>
                </div>
                <div class="flex1">
                    <p class="order-goods-title">AQUE&nbsp;ALLEGORIA</p>
                    <p class="order-goods-txt">
                        花草水语淡香水（雪梨冰沙）佛手柑香调融合雪梨香调75ml
                    </p>
                    <div class="order-goods-bottom flex">
                        <div class="order-goods-left flex1">
                            <div class="data">
                                <p class="price">￥600.00</p>
                                <p class="num">x1</p>
                            </div>

                        </div>
                        <div class="dh-btn">
                            兑换
                        </div>
                    </div>
                </div>
            </div>
            </div>
            <div class="order-goods-box">
                <div class="order-active-title flex">
                    <div class="flex1">这可能是hi个什么直播</div>
                    <div class="time">
                        2017.02.02&nbsp;08:00
                    </div>
                </div>
                <div class="goods-line flex">
                    <div class="goods-img">
                        <img src="__IMG__/order/order-goods.jpg"/>
                    </div>
                    <div class="flex1">
                        <p class="order-goods-title">AQUE&nbsp;ALLEGORIA</p>
                        <p class="order-goods-txt">
                            花草水语淡香水（雪梨冰沙）佛手柑香调融合雪梨香调75ml
                        </p>
                        <div class="order-goods-bottom flex">
                            <div class="order-goods-left flex1">
                                <div class="data">
                                    <p class="price">￥600.00</p>
                                    <p class="num">x1</p>
                                </div>

                            </div>
                            <div class="dh-btn">
                                兑换
                            </div>
                        </div>
                    </div>
                </div>
                <div class="goods-line flex">
                    <div class="goods-img">
                        <img src="__IMG__/order/order-goods.jpg"/>
                    </div>
                    <div class="flex1">
                        <p class="order-goods-title">AQUE&nbsp;ALLEGORIA</p>
                        <p class="order-goods-txt">
                            花草水语淡香水（雪梨冰沙）佛手柑香调融合雪梨香调75ml
                        </p>
                        <div class="order-goods-bottom flex">
                            <div class="order-goods-left flex1">
                                <div class="data">
                                    <p class="price">￥600.00</p>
                                    <p class="num">x1</p>
                                </div>

                            </div>
                            <div class="dh-btn">
                                兑换
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="tab-content" style="display: none">
            <div class="order-goods-box">
                <div class="order-active-title flex">
                    <div class="flex1">这可能是hi个什么直播</div>
                    <div class="time">
                        2017.02.02&nbsp;08:00
                    </div>
                </div>
                <div class="goods-line flex">
                    <div class="goods-img">
                        <img src="__IMG__/order/order-goods.jpg">
                    </div>
                    <div class="flex1">
                        <p class="order-goods-title">AQUE&nbsp;ALLEGORIA</p>
                        <p class="order-goods-txt">
                            花草水语淡香水（雪梨冰沙）佛手柑香调融合雪梨香调75ml
                        </p>
                        <div class="order-goods-bottom flex">
                            <div class="order-goods-left flex1">
                                <div class="data">
                                    <p class="price">￥600.00</p>
                                    <p class="num">x1</p>
                                </div>

                            </div>
                            <div class="dhed">
                                <img src="__IMG__/order/dhed-type.png"/>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
            <div class="order-goods-box">
                <div class="order-active-title flex">
                    <div class="flex1">这可能是hi个什么直播</div>
                    <div class="time">
                        2017.02.02&nbsp;08:00
                    </div>
                </div>
                <div class="goods-line flex">
                    <div class="goods-img">
                        <img src="__IMG__/order/order-goods.jpg">
                    </div>
                    <div class="flex1">
                        <p class="order-goods-title">AQUE&nbsp;ALLEGORIA</p>
                        <p class="order-goods-txt">
                            花草水语淡香水（雪梨冰沙）佛手柑香调融合雪梨香调75ml
                        </p>
                        <div class="order-goods-bottom flex">
                            <div class="order-goods-left flex1">
                                <div class="data">
                                    <p class="price">￥600.00</p>
                                    <p class="num">x1</p>
                                </div>

                            </div>
                            <div class="dhed">
                                <img src="__IMG__/order/dhed-type.png"/>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
    <div class="alert-bg" style="display: none"></div>
    <div class="dh-bg" style="display: none">
        <div class="erweima">
            <img src="__IMG__/order/erweima.jpg">
        </div>
        <p>二维码用于店家确认</p>
        <div class="dh-box">
            <div class="dh-inp">
                <input type="number" placeholder="请输入兑换码">
            </div>
            <p class="tip">
                提示：兑换码一旦输入正确即为已兑换,请勿随意输入
            </p>
            <div class="msg">
                <p>兑换店铺:曲艺美妆工作室</p>
                <p>咨询电话:400-1115-1159</p>
                <p>地址:岳麓区潇湘大道258号罗马嘉园C座1101室</p>
            </div>
            <div class="a-dh-btn">
                兑换
            </div>
        </div>
    </div>
<script>
    $(function(){
        window.onload = function()
        {
            var $span = $('.header-center span');
            var $content = $('.content .tab-content');
            $span.click(function(){
                $span.removeClass("active");
                var $t = $(this).index();
                $(this).addClass('active');
                $content.css('display','none');
                $content.eq($t).css('display','block');
            })
        }
        /*点击兑换弹出*/
        $(".dh-btn").click(function () {
            $(".alert-bg,.dh-bg").show();
        })
        $(".alert-bg,.a-dh-btn").click(function () {
            $(".alert-bg,.dh-bg").hide();
        })
    });
</script>
</body>
</html>